use yew::prelude::*;
use yew_router::prelude::*;

use crate::Route;

#[function_component]
pub fn Slidebar() -> Html {
  let current_route = use_route::<Route>().expect("No current route defined");

  let home_classes = {
    if current_route == Route::Home {
      classes!("nav-link", "active")
    } else {
      classes!("nav-link")
    }
  };

  let rustacean_classes = {
    if current_route == Route::Rustaceans {
      classes!("nav-link", "active")
    } else {
      classes!("nav-link")
    }
  };

  let crates_classes = {
    if current_route == Route::Crates {
      classes!("nav-link", "active")
    } else {
      classes!("nav-link")
    }
  };

  html! {
    <nav>
      <ul>
        <li>
          <Link<Route> to={Route::Home} classes={home_classes}>{"Home"}</Link<Route>>
        </li>
        <li>
          <Link<Route> to={Route::Rustaceans} classes={rustacean_classes}>{"Rustaceans"}</Link<Route>>
        </li>
        <li>
          <Link<Route> to={Route::Crates} classes={crates_classes}>{"Crates"}</Link<Route>>
        </li>
      </ul>
    </nav>
  }
}
